import React, { Component } from 'react'
import PubSub from 'pubsub-js'
import Item from '../Item'
import './index.moudle.css'
export default class List extends Component {
    state = {
        userPage: {},
        loading: false,
        err: "",
        isFirst: true
    }
    componentDidMount() {
        this.token = PubSub.subscribe("ready", (msg, state) => {
            this.setState(state)
        })
    }
    componentWillUnmount() {
        PubSub.unsubscribe(this.token)
    }
    render() {
        const { isFirst, userPage, err, loading } = this.state;
        return (
            <div className="list" >
                {
                    isFirst ? <p>欢迎使用</p> :
                        loading ? <p>加载中</p> :
                            err ? <p style={{ color: "red" }}>{err}</p> :
                                userPage.items?.map(e => {
                                    return <Item
                                        key={e.id}
                                        login={e.login}
                                        avatar_url={e.avatar_url}
                                        html_url={e.html_url} />
                                })
                }
            </div>
        )
    }
}
